var userName = "";
var defaultDateFormat = 'm/d/yyyy';
var weekDays = {
    1: ['Monday', 0, ''],
    2: ['Tuesday', 1, ''],
    3: ['Wednesday', 2, ''],
    4: ['Thursday', 3, ''],
    5: ['Friday', 4, ''],
    6: ['Saturday', 5, ''],
    7: ['Sunday', 6, '']
};

var userNameKey = 'userName';
var nextDayToFillKey = 'nextDayToFillKey';

var port = chrome.extension.connect({name: "storageAccess"});
port.onMessage.addListener(proccessExtensionResponse);

initPropertyButton();
initDays();
initDaysDropDown();

function initDays() {
    var firstDayOfWeek = new Date();
    firstDayOfWeek.setDate(firstDayOfWeek.getDate() - firstDayOfWeek.getDay());

    for(var i = 1; i < 8; i++) {
        var day = new Date();
        day.setDate(firstDayOfWeek.getDate() + i);
        weekDays[i][2] = day.getMonth() + '/' + day.getDate() + '/' + day.getFullYear();
        console.log(weekDays[i][0] + ':' + weekDays[i][2]);
    }
}

function initDaysDropDown() {
    var cell = $('#part1 td:eq(1)');
    var separator = $('<td class="ms-separator">&nbsp;</td>');
    var quickFillDropDown = $('<select id="daySelector" class="ms-ButtonHeightWidth"/>');

    for(var i = 1; i < 8; i++) {
        var opt = $('<option>');
        opt.text(weekDays[i][0]);
        opt.attr('value', weekDays[i][2]);
        quickFillDropDown.append(opt);
    }

    cell.before(separator);
    separator.before(quickFillDropDown);
}

function initPropertyButton() {
    var showPropButton = $("<div>Properties</div>");

    showPropButton.hover(function() {
        $(this).addClass("ms-menubuttonactivehover");
        $(this).removeClass("ms-menubuttoninactivehover");
    }, function() {
        $(this).addClass("ms-menubuttoninactivehover");
        $(this).removeClass("ms-menubuttonactivehover");
    });

    showPropButton.addClass("ms-menubuttoninactivehover");

    showPropButton.css("color", "#002672");
    showPropButton.css("cursor", "pointer");
    showPropButton.css("white-space", "nowrap");
    showPropButton.css("font-family", "tahoma");
    showPropButton.css("font-size", "8pt");
    showPropButton.attr("id", "propertyButton");

    showPropButton.click(showProperties);
    $("table.ms-menutoolbar td.ms-toolbar:eq(1)").after(showPropButton);

    addPropForm(showPropButton);
}

function addPropForm(elem) {
    var propForm = $("<td></td>");
    var propInput = $("<input/>");
    var propSubmitButton = $("<input/>");

    propSubmitButton.click(saveProperties);
    propSubmitButton.attr("type", "button");
    propSubmitButton.attr("value", "Save");

    propInput.attr("id", "propInput");
    propInput.attr("type", "text");
    propInput.attr("value", (getUserName() ? getUserName() : "Enter user name"));
    propInput.css("color", "grey");
    propInput.css("font-family", "tahoma");
    propInput.css("font-size", "8pt");
    propInput.click(function() {
        if($(this).attr("value") == "Enter user name") {
            $(this).attr("value", "");
            $(this).css("color", "black");
        }
    });

    propForm.attr("id", "propForm");
    propForm.attr("nowrap", "true");
    propForm.append(propInput);
    propForm.append(propSubmitButton);
    propForm.css("display", "none");

    elem.after(propForm);
}

function showProperties() {
    $("#propForm").animate({ opacity: "show" }, "slow");
    $("#propInput").attr("value", (getUserName() ? getUserName() : "Enter user name"));
}

function getUserName() {
    getProperty(userNameKey);
    return userName;
}

function getProperty(key) {
    port.postMessage({storageAttr: key, operationId: 2});
}

function saveProperties() {
    port.postMessage({attrKey: userNameKey, attrValue: $("#propInput").attr("value"), operationId: 1});
    $("#propForm").animate({ opacity: "hide" }, "slow");
}

function proccessExtensionResponse(response) {
    var operationId = response.operationId;
    console.log('resieving response: operationId = ' + operationId);
    switch(operationId) {
        case 1: // save attribute to local storage
            console.log('message: ' + response.message);
            break;
        case 2: // getting attribute from local storage
            userName = response.attrValue;
            console.log('reseived user name: ' + response.attrValue);
            break;
        default: return;
    }
}